<template>
  <view class="base-container">
    <view class="login">
      <view class="flex justify-between px-32rpx py-32rpx text-32rpx" :style="{ paddingTop: common.systemInfo.statusBarHeight + 10 + 'px' }"> </view>
      <view class="login-top pt-24rpx">
        <!-- <image class="login-icon" src="https://mingtu-resources.oss-cn-shenzhen.aliyuncs.com/mtym-app-assets/icon-logo.svg"></image>
        <view class="login-title">让人脉变现-助力万商兴</view> -->
        <text class="text-48rpx text-#1C213E fw-600">欢迎登录易盟</text>
      </view>
      <view class="login-btn px-32rpx pt-300rpx">
        <mt-button :shake="false" class="btn1 mb-24rpx" shape="circle" @click="handleOneLogin">本机号码一键登录</mt-button>
        <mt-button :shake="false" type="info" shape="circle" plain class="mb-24rpx" style="width: 100%" @click="goOtherLogin"
          >手机号/账号密码登录</mt-button
        >
        <ReadAgreement ref="readAgreementRef" v-model="agreementProtocolFlag"></ReadAgreement>
      </view>
    </view>
    <view class="login-footer">
      <uv-divider text="其他登录方式"></uv-divider>
      <view class="login-footer-logo safety-48">
        <uv-icon
          v-if="isWechatInstalled"
          name="https://mingtu-resources.oss-cn-shenzhen.aliyuncs.com/mtym-app-assets/icon-wx.svg"
          size="46"
          @click="handleLogin(3)"
        ></uv-icon>
        <uv-icon
          v-if="commonStore.systemInfo.osName === 'ios'"
          name="https://mingtu-resources.oss-cn-shenzhen.aliyuncs.com/mtym-app-assets/icon-iphone.svg"
          size="46"
          @click="handleLogin(4)"
        ></uv-icon>
      </view>
    </view>

    <app-renew></app-renew>
  </view>
</template>

<script setup>
import { loginByPhoneAuth } from '@/api/login';
import { clientdictgetSimpleDictList } from '@/api/common';
import ReadAgreement from '@/pages/login/components/ReadAgreement.vue';
import { clearOssKey } from '@/utils/tools';
import { handleWeixinLogin, handleAppleLogin } from '@/utils/login';
import userCommon from '@/store/common';
import useCommon from '@/store/common';
// #ifdef APP
import { buildSheet } from '@/utils/ui-config';
const aLiSDKModule = uni.requireNativePlugin('AliCloud-NirvanaPns');
// #endif
const common = useCommon();

const commonStore = userCommon();

const readAgreementRef = ref(null);
const agreementProtocolFlag = ref([]);

function goOtherLogin() {
  uni.navigateTo({
    url: '/pages/login/index'
  });
}

function handleOneLogin() {
  if (!agreementProtocolFlag.value.length) {
    readAgreementRef.value.openTips(1);
    return;
  }
  const config = buildSheet();
  uni.showLoading({
    mask: true
  });
  aLiSDKModule.getLoginToken(
    5000,
    config,
    (tokenResult) => {
      console.log('a', tokenResult);
      uni.hideLoading();
      console.log(JSON.stringify(tokenResult));
      if (tokenResult.resultCode === '600001') {
        console.log('授权页拉起成功');
        aLiSDKModule.setCheckboxIsChecked(false);
      } else if (tokenResult.resultCode === '600000') {
        oneClickLogin(tokenResult.token);
        //手动关闭授权页
        aLiSDKModule.quitLoginPage();
      } else {
        //手动关闭授权页
        aLiSDKModule.quitLoginPage();
        uni.showToast({
          icon: 'none',
          title: tokenResult.msg
        });
      }
    },
    (clickResult) => {
      console.log(123, clickResult);
      switch (clickResult.resultCode) {
        case '700002':
          if (!clickResult.result.isChecked) {
            if (!config.uiConfig.setPrivacyAlertIsNeedShow) {
              uni.showToast({
                icon: 'none',
                title: '请同意服务条款'
              });
            }
          }
        case '700010':
          aLiSDKModule.quitLoginPage();
          break;
        case '700011':
          aLiSDKModule.quitLoginPage();
          break;
      }
    },
    (customUiResult) => {
      console.log('点击了自定义控件 ', customUiResult);
      if (customUiResult.widgetId === 'close') {
        //点击了自定义的关闭授权页按钮
        aLiSDKModule.quitLoginPage();
      } else if (customUiResult.widgetId === 'closePrivacyAlert') {
        aLiSDKModule.closePrivactAlertView();
      } else {
        plus.nativeUI.toast('点击了自定义按钮，widgetId：' + customUiResult.widgetId);
      }
    }
  );
}

async function oneClickLogin(accessToken) {
  clearOssKey();
  try {
    await loginByPhoneAuth({ accessToken, regionCode: '' });
    uni.reLaunch({
      url: '/pages/index/index'
    });
  } catch (error) {}
}

const loginApp = (type) => {
  if (agreementProtocolFlag.value && agreementProtocolFlag.value.length) {
    switch (type) {
      case 3:
        // 微信登录
        handleWeixinLogin('');
        break;
      case 4:
        // 苹果登录
        handleAppleLogin('');
        break;
      default:
        break;
    }
  } else {
    readAgreementRef.value.openTips(type);
  }
};

// 账号密码登录
const handleLogin = (loginSign) => {
  // 登录之前清除ossKey
  clearOssKey();
  loginApp(loginSign);
};

const isWechatInstalled = ref(false);
function handleShowIcon() {
  clientdictgetSimpleDictList({
    key: 'app_open_weixin'
  }).then((res) => {
    if (res.data[0]?.dictValue === '0') {
      isWechatInstalled.value = true;
    } else {
      isWechatInstalled.value = false;
    }
  });
}

onLoad(() => {
  handleShowIcon();
});
</script>

<style lang="scss" scoped>
.base-container {
  min-height: 100vh;
  background: #ffffff;
  .login {
    background: linear-gradient(234deg, rgba(20, 132, 238, 0.05) 0%, rgba(255, 255, 255, 0.05) 100%);
  }
  .login-top {
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    align-items: flex-start;
    padding-left: 48rpx;
    .login-icon {
      width: 342rpx;
      height: 134rpx;
    }
    .login-title {
      font-weight: 400;
      font-size: 24rpx;
      padding-top: 15rpx;
      color: #727687;
    }
  }
  .login-btn {
    .mt-button.btn1 {
      width: 100%;
      background: linear-gradient(130deg, #447fee 0%, #3d76e1 100%);
    }
  }
  .login-footer {
    padding: 0 205rpx;
    width: 100%;
    box-sizing: border-box;
    position: fixed;
    bottom: 0;
    background-color: #fff;
    .login-footer-logo {
      margin-top: 18rpx;
      display: flex;
      justify-content: space-around;
      .logo-icon {
        width: 92rpx;
        height: 92rpx;
      }
    }
  }
}
</style>
